<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
    <title>浏览器定位</title>
    <link rel="stylesheet" href="http://cache.amap.com/lbs/static/main1119.css"/>
    <script type="text/javascript" src="http://webapi.amap.com/maps?v=1.3&key=您申请的key值"></script>
    <script type="text/javascript" src="http://cache.amap.com/lbs/static/addToolbar.js"></script>
<body>
<div id='container'></div> <!--style="visibility: hidden;"-->
<div id="tip"></div>

<script src="assets/js/jquery.js"></script>
<script src="assets/js/bootstrap.js"></script>
<script src="assets/js/headroom.min.js"></script>
<script src="assets/js/jQuery.headroom.min.js"></script>
<script src="assets/js/template.js"></script>
<script type="text/javascript">
    var map, geolocation;
    var lng;
    var lat;
    //加载地图，调用浏览器定位服务
    map = new AMap.Map('container', {
        resizeEnable: true

    });
    map.plugin('AMap.Geolocation', function() {
        geolocation = new AMap.Geolocation({
            enableHighAccuracy: true,//是否使用高精度定位，默认:true
            timeout: 10000,          //超过10秒后停止定位，默认：无穷大
            buttonOffset: new AMap.Pixel(10, 20),//定位按钮与设置的停靠位置的偏移量，默认：Pixel(10, 20)
            zoomToAccuracy: true,      //定位成功后调整地图视野范围使定位位置及精度范围视野内可见，默认：false
            convert: true,
            buttonPosition:'RB',
            maximumAge:100
        });
        map.addControl(geolocation);
        //setTimeout("alert('王海鑫！')",3000);    //需要函数触发
        //setTimeout("alert('王海！')",6000);    //需要函数触发
        geolocation.getCurrentPosition();

        //geolocation.watchPosition();
        AMap.event.addListener(geolocation, 'complete', onComplete);//返回定位信息
        AMap.event.addListener(geolocation, 'error', onError);      //返回定位出错信息
    });
    //解析定位结果
    function onComplete(data) {
        var str=['定位成功'];
        str.push('经度：' + data.position.getLng());
        lng = data.position.getLng();
        str.push('纬度：' + data.position.getLat());
        lat = data.position.getLat();
        str.push('精度：' + data.accuracy + ' 米');
        str.push('是否经过偏移：' + (data.isConverted ? '是' : '否'));
        str.push('是否经过偏移：' + (data.info));
        document.getElementById('tip').innerHTML = str.join('<br>');

        //ajax获取后台接口信息
        $.ajax({//用来打卡
            type :"POST",
            async:true,
            data :{
                "longitude":lng,
                "latitude":lat
            },
            timeout:300000,
            contentType: "application/x-www-form-urlencoded",
            url : "/punch",
            dataType:"json",
            success: function (data) {
                var data=data;
                if (data.ret == 0) {
                    alert(data.data.sp2 + "米");
                }
                else {
                    alert(data.msg);
                }
            }
        });
    }
    //解析定位错误信息
    function onError(data) {
        document.getElementById('tip').innerHTML = '定位失败';
    }


</script>
</body>
</html>